<template>
  <view>
    <cm-scale-view content-width="440" @finish="finishHandler">
      <view class="liuren-content-wrapper" style="height: 440px;">
        <!-- 空亡 -->
        <liuren-circle v-for="(item, index) in dunjiaProxy.zhiPalaces" :key="item.baseId" :index="index" :layer="2 - layerOffset">
          <div v-if="keyEmpties.indexOf(item.ele.yuejiang.index) >= 0" class="liuren-content-empty"></div>
        </liuren-circle>
        
        <liuren-circle v-for="(item, index) in dunjiaProxy.zhiPalaces" :key="item.ele.zhi.id" :index="index" layer="1">
          <bagua-element v-if="isZhiShow"
            size="14" :bagua="item.ele.zhi"
            :season="seasonIndex" :compare-selected="compareSelected"
            @click="elementClickHandler(item.ele.zhi)"></bagua-element>
        </liuren-circle>
        <liuren-circle v-for="(item, index) in dunjiaProxy.zhiPalaces" :key="item.ele.yuejiang.id" :index="index" :layer="2 - layerOffset">
          <bagua-element
            size="14" :bagua="item.ele.yuejiang" sim-name
            :season="seasonIndex" :compare-selected="compareSelected"
            @click="elementClickHandler(item.ele.yuejiang)">
          </bagua-element>
        </liuren-circle>
        <liuren-circle v-for="(item, index) in dunjiaProxy.zhiPalaces" :key="item.ele.guiGod.id" :index="index" :layer="3 - layerOffset">
          <bagua-element
            size="14" :bagua="item.ele.guiGod" sim-name
            :season="seasonIndex" :compare-selected="compareSelected"
            @click="elementClickHandler(item.ele.guiGod)"></bagua-element>
        </liuren-circle>
        <liuren-circle v-for="(item, index) in dunjiaProxy.zhiPalaces" :key="item.ele.liurenGan.id" :index="index" :layer="4 - layerOffset">
          <bagua-element
            size="14" :bagua="item.ele.liurenGan"
            :season="seasonIndex" :compare-selected="compareSelected"
            @click="elementClickHandler(item.ele.liurenGan)"></bagua-element>
        </liuren-circle>
      </view>
    </cm-scale-view>
  </view>
</template>

<script src="./liurenContent.js"></script>

<style lang="stylus">
@import './liurenContent.styl'
</style>
